<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="/News/admin/assets/jquery/jquery-ui.css" />
<link rel="stylesheet" href="/News/admin/assets/css/adminIndex.css" />
</head>

<body>
	<!-- 创建一个包含全部的总div -->
	<div class="adminAllDiv">

		<!-- 页面的顶栏 -->
		<header class="adminHeader">
			<!-- 侧边栏显示 -->
			<div class="adminHeaderNavShow">
				<img src="/News/admin/assets/img/rightHide.png">
			</div>

			<!-- 时间显示 -->
			<span class="adminHeaderDate"></span>

			<!-- log显示 -->
			<div class="adminHeaderLogo">
				<!-- Logo图片 -->
				<img src="/News/admin/assets/img/logo.png" alt="Logo图片">
			</div>

			<!-- 用户名显示以及退出登录页面 -->
			<span class="adminHeaderName"> ${adminLogin.adminName}</span>

		</header>


		<!-- 页面侧栏 -->
		<nav class="adminNav">

			<!-- 管理员信息展示页面 -->
			<div class="adminNavDivShow">
				<!-- 管理员头像显示 -->
				<img src="/News/admin/assets/img/adminTestImg.jpg" class="adminNavAdminImg">
				<!-- 管理员账号 -->
				<span class="adminNavAdminName">账户：${adminLogin.adminName}</span>
				<!-- 管理员密码 -->
				<span class="adminNavAdminPass">密码：${adminLogin.adminPass}</span>
			</div>

			<!-- 各级菜单栏 -->
			<div id="adminNavMenu" class="adminNavMenu">
				<h3>&nbsp;用户管理菜单</h3>
				<div class="adminIndexUser">
					<p>用户增删改查</p>
				</div>
				<h3>&nbsp;新闻管理菜单</h3>
				<div class="adminIndexNews">
					<p>新闻查找删除</p>
					<p>新闻添加修改</p>
				</div>
				<h3>&nbsp;评论管理菜单</h3>
				<div class="adminIndexReview">
					<p>评论增删改查</p>
				</div>
				<h3>&nbsp;管理员信息</h3>
				<div class="adminIndexAdmin">
					<p>管理员增删改查</p>
				</div>
			</div>

			<!-- 隐藏按钮 -->
			<div class="adminNavHide">
				<img src="/News/admin/assets/img/leftHide.png">
			</div>

		</nav>

		<!-- 右侧详细信息 -->
		<article class="adminArticle">
			<iframe src="/News/admin/adminUser.jsp"></iframe>
		</article>

		<!-- 页面底部 -->
		<footer class="adminFooter"></footer>
	</div>
</body>
<script src="/News/admin/assets/jquery/jquery-3.7.1.js"></script>
<script src="/News/admin/assets/jquery/jquery-ui.js"></script>
<script src="/News/admin/assets/js/adminIndex.js"></script>
<script>
	//初始化函数
	$(function() {
		//调用更新界面方法
		updateInterface();
		//刷新事件方法
		setInterval(getDate, 1000);
	});

	//更新总界面函数
	function updateInterface() {
		//设置Alldiv
		$(".adminAllDiv").width($(window).width());
		$(".adminAllDiv").height($(window).height());
		setAdminAllDivSize();
		//设置侧栏
		$(".adminNav").width($(".adminAllDiv").width() * 0.15);
		$(".adminNav").height($(".adminAllDiv").height());
		setAdminNavSize();
		//设置顶栏
		setAdminHeaderSize();
		//设置底栏大小
		$(".adminFooter").width(
				$(".adminAllDiv").width() - $(".adminNav").width());
		$(".adminFooter").height($(".adminAllDiv").height() * 0.03);
		setAdminFooterSize();
		//设置右侧内容栏大小
		setAdminArticleSize();
		//循环设置时间
		getDate();
		//隐藏顶栏的显示按钮
		$(".adminHeaderNavShow").hide();
	}

	//隐藏侧边栏函数
	function hideNav() {
		//设置侧边栏大小
		//侧边栏设置
		$(".adminNav").width("0px");
		$(".adminNav").height("0px");
		//设置Alldiv
		setAdminAllDivSize();
		//设置顶栏
		setAdminHeaderSize();
		//设置底栏大小
		setAdminFooterSize();
		//设置右侧内容栏大小
		setAdminArticleSize();
		//循环设置时间
		getDate();
		$(".adminHeaderNavShow").show();
	}

	//浏览器窗口变化调用函数
	window.addEventListener('resize', function(event) {
		updateInterface();
	});

	// 使All自适应大小
	function setAdminAllDivSize() {
		$(".adminAllDiv").width($(window).width());
		$(".adminAllDiv").height($(window).height());
	}

	//设置侧栏大小
	function setAdminNavSize() {
		//侧边栏设置
		$(".adminNav").width($(".adminAllDiv").width() * 0.15);
		$(".adminNav").height($(".adminAllDiv").height());
		//管理员信息展示页面设置
		$(".adminNavDivShow").width($(".adminNav").width() * 0.9);
		$(".adminNavDivShow").height($(".adminNav").height() * 0.15);
		$(".adminNavDivShow").css("left", $(".adminNav").width() * 0.05);
		$(".adminNavDivShow").css("top", $(".adminNav").height() * 0.02);
		$(".adminNavAdminImg").width($(".adminNavDivShow").width() * 0.35);
		$(".adminNavAdminImg").height($(".adminNavDivShow").width() * 0.35);
		$(".adminNavAdminImg")
				.css("left", $(".adminNavDivShow").width() * 0.05);
		$(".adminNavAdminImg").css("top", $(".adminNavDivShow").width() * 0.05);
		$(".adminNavAdminName").css("left",
				$(".adminNavDivShow").width() * 0.41);
		$(".adminNavAdminName")
				.css("top", $(".adminNavDivShow").height() * 0.2);
		$(".adminNavAdminPass").css("left",
				$(".adminNavDivShow").width() * 0.41);
		$(".adminNavAdminPass")
				.css("top", $(".adminNavDivShow").height() * 0.5);
		//各级菜单栏设置
		$(".adminNavMenu").width($(".adminNav").width() * 0.9);
		$(".adminNavMenu").height($(".adminNav").height() * 0.55);
		$(".adminNavMenu").css("left", $(".adminNav").width() * 0.05);
		$(".adminNavMenu")
				.css(
						"top",
						$(".adminNav").height() * 0.04
								+ $(".adminNavDivShow").height());
		//隐藏按钮设置
		$(".adminNavHide").width($(".adminNav").width() * 0.15);
		$(".adminNavHide").height($(".adminNav").width() * 0.15);
		//隐藏按钮图片设置
		$(".adminNavHide>img").width($(".adminNavHide").width());
		$(".adminNavHide>img").height($(".adminNavHide").height());
	}

	//设置顶栏内容,宽度为All减去侧栏
	function setAdminHeaderSize() {
		//顶栏设置
		$(".adminHeader").width(
				$(".adminAllDiv").width() - $(".adminNav").width());
		$(".adminHeader").height($(".adminAllDiv").height() * 0.08);
		$(".adminHeader").css("left", $(".adminNav").width());
		//顶栏内Logo设置
		$(".adminHeaderLogo").width($(".adminHeader").width() * 0.155);
		$(".adminHeaderLogo").height($(".adminHeader").height());
		$(".adminHeaderLogo>img").width($(".adminHeaderLogo").width());
		$(".adminHeaderLogo>img").height($(".adminHeaderLogo").height());
		//顶栏时间设置
		$(".adminHeaderDate").css("left", $(".adminHeader").width() * 0.01);
		$(".adminHeaderDate").css("top", $(".adminHeader").height() * 0.2);
		//顶栏退出设置
		$(".adminHeaderName").css("left", $(".adminHeader").width() * 0.93);
		$(".adminHeaderName").css("top", $(".adminHeader").height() * 0.2);
	}

	//设置右侧内容栏
	function setAdminArticleSize() {
		$(".adminArticle").width(
				($(".adminAllDiv").width() - $(".adminNav").width()) * 0.99);
		$(".adminArticle").height(
				($(".adminAllDiv").height() - $(".adminHeader").height() - $(
						".adminFooter").height()) * 0.99);
		$(".adminArticle").css("top", $(".adminHeader").height());
		$(".adminArticle").css("left", $(".adminNav").width());
		$(".adminArticle").css("overflow", "hidden");
		//设置内嵌界面的宽高
		$(".adminArticle>iframe").width(
				$(".adminAllDiv").width() - $(".adminNav").width());
		$(".adminArticle>iframe").height(
				$(".adminAllDiv").height() - $(".adminHeader").height()
						- $(".adminFooter").height());
	}

	//设置底栏大小
	function setAdminFooterSize() {
		$(".adminFooter").width(
				$(".adminAllDiv").width() - $(".adminNav").width());
		$(".adminFooter").height($(".adminAllDiv").height() * 0.03);
		$(".adminFooter").css("left", $(".adminNav").width());
		$(".adminFooter").css("top",
				$(".adminAllDiv").height() - $(".adminFooter").height());
	}

	//时间获取函数
	function getDate() {
		// 获取当前时间
		var now = new Date();
		// 提取本地日期的年、月和日
		var year = now.getFullYear();
		var month = now.getMonth() + 1; // 月份是从 0 开始的，所以需要加 1
		var day = now.getDate();
		// 提取本地时间的小时、分钟和秒
		var hours = now.getHours();
		var minutes = now.getMinutes();
		var seconds = now.getSeconds();
		// 格式化时间为 HH:mm:ss
		var formattedTime = year + "-" + month + "-" + day + "-" + hours + ":"
				+ minutes + ":" + seconds;
		//设置顶栏的Span时间显示
		$(".adminHeaderDate").html(formattedTime);
	}

	//多级菜单栏方法
	$(function() {
		//自定义图标
		$("#adminNavMenu").accordion({
			collapsible : true,
		});
	});

	//隐藏按钮方法，仅能隐藏
	$(".adminNavHide").click(function() {
		$(".adminNav").hide("slide");
		//调用隐藏侧边栏函数
		hideNav();
	});
	//显示方法，仅能显示
	$(".adminHeaderNavShow").click(function() {
		$(".adminNav").show("slide");
		//调用更新页面方法
		updateInterface();
	});
	//用户栏点击跳转
	$(".adminIndexUser p").click(function() {
		$(".adminArticle>iframe").attr('src', '/News/admin/adminUser.jsp');
	});
	//新闻栏点击跳转
	$(".adminIndexNews p:eq(0)").click(function() {
		$(".adminArticle>iframe").attr('src', '/News/admin/adminNewsQueryAndDelete.jsp');
	});
	$(".adminIndexNews p:eq(1)").click(function() {
		$(".adminArticle>iframe").attr('src', '/News/admin/adminNewsInsertAndUpdate.jsp');
	});
	//評論點擊跳轉
	$(".adminIndexReview p:eq(0)").click(function() {
		$(".adminArticle>iframe").attr('src', '/News/admin/adminReview.jsp');
	});
	//管理員點擊跳轉
	$(".adminIndexAdmin p").click(function() {
		$(".adminArticle>iframe").attr('src', '/News/admin/adminAdmin.jsp');
	});
	//鼠标悬浮颜色更换方法
	$(".adminNavMenu p").hover(function() {
		// 鼠标悬浮时执行的代码
		$(this).css('background-color', '#d0d0d0');
	}, function() {
		// 鼠标移开时执行的代码
		$(this).css('background-color', '#fff');
	});
</script>
</html>